<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 标签分类： 双标签、单标签 -->

    <!-- 
        操作单标签的内容
            语法：
                设置： 标签.value = 值
                获取： var 变量 = 标签.value
        操作闭合标签的内容
            语法：innerHTML
                设置： 标签.innerHTML = 值    
                获取： var 变量 = 标签.innerHTML
                特性：
            语法：innerText
                设置： 标签.innerText = 值    
                获取： var 变量 = 标签.innerText
            区别：
     -->
    <input type="text" value="哈哈哈哈">
    <button>按钮</button>


    <script>
        // 需求：点击按钮改变里面的内容为呵呵呵呵；

        // 1、找到谁
        var oInput = document.querySelector('input');
        var oBtn = document.querySelector('button');
        // 2、加事件
        oBtn.onclick = function(){
            // 3、做什么事
            // oInput.value = "呵呵呵呵呵";

            //获取里面的值
            var a  = oInput.value;
            alert(a);
        }



    </script>
</body>
</html>